Skip to content

Tests e2e#4

Open
doinglivingtest wants to merge 3 commits intodrift-labs:masterfrom
doinglivingtest:tests-e2e
Open

Tests e2e#4
doinglivingtest wants to merge 3 commits intodrift-labs:masterfrom
doinglivingtest:tests-e2e

Conversation

@doinglivingtest
Copy link

Drift Labs Trial – Test Automation Solution

This PR contains a solution for the Drift Labs trial using Playwright as the test automation framework and Synpress to handle wallet interactions.


Pre-requisites

  1. Install dependencies:
npm install
  1. Run the Drift UI app locally:

You can refer to the official repository for setup:
https://github.com/drift-labs/drift-ui-template

  1. Phantom Wallet:

Install Phantom wallet from their offical site:
https://phantom.com

Setup Wallet Caches

  1. In your .env.local file, add the following environment variables with the seed phrases of pre-funded Solana wallets:
SEED_PHRASE_0="festival weapon obtain citizen bullet demise across science stumble swap toy either"
SEED_PHRASE_1="safe note ignore claim capital loud imitate adapt explain egg curious cart"
SEED_PHRASE_2="since eager wife swim quarter enough coach gift bean host inquiry index"
SEED_PHRASE_3="reunion supply voice buzz faculty coyote session action require verify upon ticket"
SEED_PHRASE_4="congress chat faculty tissue parent exit tobacco strategy ketchup indicate rival glide"
SEED_PHRASE_5="own neither myth grunt suspect fantasy burger base vote sponsor minimum meadow"
SYNPRESS_WALLET_PASSWORD=Tester@1234
  1. Make the wallet cache generation script executable:

chmod +x tests/utils/generate_wallet_caches.sh

  1. Run the script to generate wallet caches:

./tests/utils/generate_wallet_caches.sh

  • This will create wallet caches under the .cache-synpress folder.

  • Copy the generated cache IDs into the run-tests.sh file.

  • Example usage in run-tests.sh:

run_test "{this_is_the_cache_id}" "create-account-deposit.spec.ts" "TC-CA-001"

Running Tests

All tests can be executed with:

npm run test:drift

The script will:

  1. Execute all tests sequentially.
  2. Use the specified SYNPRESS_CACHE_IDs for wallet interactions.
  3. Generate JSON reports under /reports for each test.
  4. Open a merged HTML report at the end.

Project Structure

DRIFT-UI-TEMPLATE/
│
├── .idea/                              # IDE settings (ignored)
├── .cache-synpress/                    # Wallet cache folder
├── next.config.ts                      # Next.js config
├── node_modules/                       # Dependencies
├── playwright-report/                  # Playwright report (default)
├── reports/                            # Custom reports folder
├── tests/
│   ├── base/
│   │   ├── BasePage.ts
│   │   └── BaseTest.ts
│   ├── config/
│   │   └── constants.ts
│   ├── e2e/
│   │   ├── create-account-deposit.spec.ts
│   │   └── place-limit-order.spec.ts
│   ├── helpers/
│   │   └── basic.setup.ts
│   ├── pages/
│   │   ├── HomePage.ts
│   │   ├── PerpetualsPage.ts
│   │   └── UserPage.ts
│   └── utils/
│       ├── generate_wallet_caches.sh
│       └── run-tests.sh
├── package.json
├── package-lock.json
├── playwright.config.ts
└── README.md

Notes

Each test in run-tests.sh uses a specific Synpress cache ID to ensure wallet state is preserved.

Make sure the Drift app is running locally before executing the tests.

@vercel
Copy link

vercel bot commented Sep 30, 2025

@doinglivingtest is attempting to deploy a commit to the drift-web Team on Vercel.

A member of the Team first needs to authorize it.

@doinglivingtest
Copy link
Author

Last commit details:

commit: add report merge + HTML summary, improve test utilities, and update runner
• Add report tooling
• Add merge-reports.js
• Recursively finds .last-run.json files under reports, safely parses them, and writes a consolidated combined-report.json with metadata (generatedAt, sourceCount, reports[]).
• Add ui/scripts/generate-html-report.js
• Reads combined-report.json and generates ui/reports/combined-report.html.
• Summary counts (passed/failed/other) and per-report rows.
• Recursively discovers all images (png/jpg/gif/webp) under each report folder and displays clickable thumbnails that link to the full image.
• CI / runner integration
• Update ui/tests/utils/run-tests.sh
• After all tests, run node scripts/merge-reports.js && node scripts/generate-html-report.js to produce combined JSON + HTML summary automatically (no Playwright UI merge).
• Test framework & utilities improvements
• ui/tests/base/BasePage.ts
• Add waitForHealthyState() helper to wait for a health-check response (200) before proceeding.
• ui/tests/base/BaseTest.ts
• Export sleep(ms) helper for reuse in pages/tests.
• ui/tests/pages/PerpetualsPage.ts
• Import sleep from BaseTest and use it in cancelOrderCreated() to wait with sleep(12000) (replacing a direct waitForTimeout).
• Tests updates (e2e)
• ui/tests/e2e/create-account-deposit.spec.ts
• beforeEach now receives context, navigates to /, calls homePage.waitForHealthyState() and closes any about:blank pages that were opened automatically by Synpress.
• Adds afterEach to close page and context.
• Minor test flow tweaks (some navigation/ordering adjustments).
• ui/tests/e2e/place-limit-order.spec.ts
• Similar beforeEach changes: uses context, checks health, closes blank tabs.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant